<!--
 * @Author: 熔岩巨兽 2141826215@qq.com
 * @Date: 2024-09-02 20:33:50
 * @LastEditTime: 2024-09-02 21:27:34
 * @LastEditors: 熔岩巨兽 2141826215@qq.com
 * @FilePath: \vue-vite-project\src\views\CommunicationMode\UseAttrRefParent\index.vue
 * Copyright (c) 2024 by 熔岩巨兽 2141826215@qq.com, All Rights Reserved. 
-->
<template>
  <div class="info">
    {{ info }}
    <div>爸爸的钱：{{ mony }}</div>
    <button @click="getSonMony">拿儿子压岁钱</button>
  </div>
  <div class="useAttrRefParent">
    <children1 v-model="info"></children1>
    <!-- <children1 :model-value="info" @update:modelaVlue="((res: string) => (info = res))"></children1> -->
    <children2 ref="son"></children2>
  </div>
</template>

<script lang="ts" setup name="ComponentName">
import children1 from "./children1.vue";
import children2 from "./children2.vue";
import { ref } from "vue";
let info = ref("我是v-model传值");
let mony = ref(10000000);
let son = ref();
defineExpose({ mony });
const getSonMony = () => {
  mony.value = mony.value + 1000;
  son.value.monye = son.value.monye - 1000;
  console.log(son.value.monye);
};
</script>

<style scoped>
.useAttrRefParent {
  width: 100%;
  height: 50vh;
  background-color: skyblue;
  display: flex;
  justify-content: space-between;
}
.info {
  background-color: skyblue;
}
</style>
